*
  margin: 0
  padding: 0

body
  display flex
  flex-direction: row
  justify-content: center
  align-items: center
  height: 100vh
  overflow: hidden

.container
  display: flex
  width 90vw
  .panel
    height 80vh
    border-radius: 50px
    color: #fff
    cursor: pointer
    flex 0.5
    margin 10px
    position: relative
    background-size: cover
    background-position: center
    background-repeat: no-repeat
    transition: all 700ms ease-in
    h3
      font-size: 24px
      position: absolute
      left: 20px
      bottom: 20px
      margin: 0
      opacity 0
      transition: all 500ms ease-in
    &.active
      flex 5
      h3
        opacity 1

@media (max-width: 480px){
  .contaniner{
    width 100vw
    }
    .panel:nth-of-type(4),
    .panel:nth-of-type(5){
      display: none;
  }
}